<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width,  user-scalable=no">

    <title>PEDI儿童残疾功能评估</title>

    <!--<link href="/css/bootstrap.min.css" rel="stylesheet">-->
    <!--<link href="/css/font-awesome/css/font-awesome.css" rel="stylesheet">-->

    <!--<link href="/css/animate.css" rel="stylesheet">-->
    <!--<link href="/css/style.css" rel="stylesheet">-->
    <!--<link href="/css/ics/common.css" rel="stylesheet">-->


    <style>
        /*.table-a table{border:1px solid #000000}*/

        td {
            vertical-align: bottom;
        }

        #table_guage {
            width: 100%;
        }

        #table_guage hr {
            margin: 6.5px auto;
        }
    </style>


</head>

<body>
<form>

    <div style="font-size: 16px;height: 26px;/*margin-bottom: 26px;*/">
        <table width="100%">
            <tr>
                <td align="left">
                    <label class="print-font16">评定内容</label>
                </td>

                <td align="right">
                    <table class="edit-page hide no-print">
                        <tr>
                            <td><label class="print-font16">快速评测:</label></td>
                            <td style="padding-bottom: 8px">
                                <select id="select_fast_eval" onchange="fastEval();"
                                        style="font-size: 13px; padding: 0;height: 22px;width: 80px"
                                        class="form-control">
                                    <option value="0">请选择</option>
                                    <option value="2">均选择“能”</option>
                                    <option value="1">均选择“不能”</option>
                                </select>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>
    <div style="height: 1px;border-bottom: 1px solid #d0d0d0;" class="print-div-hr"/>

    <div class="hide">
        <table border="0" cellspacing="0" cellpadding="0">
            <tr>
                <td align="left" width="80px"><label style="font-size: 13px">陪同者</label></td>
                <td align="left"><input type="text" class="form-control" style="width: 200px" id="text_companion"/>
                </td>
            </tr>
        </table>

    </div>

    <!--<div class="view-page hide">-->
    <!--<table border="0" cellspacing="0" cellpadding="0">-->
    <!--<tr>-->
    <!--<td align="left" width="80px"><label style="font-size: 18px">陪同者</label></td>-->
    <!--<td align="left"><label id="span_companion" style="font-weight:normal;font-size: 18px"></label></td>-->
    <!--</tr>-->
    <!--</table>-->
    <!--</div>-->

    <!--<div style="margin-bottom: 30px;font-size: 20px">-->
    <!--<label>评定内容</label>-->
    <!--</div>-->
    <!--<div style="width: 100%;" align="center">-->

    <!--<table id="table_total" class="view-page table table-bordered hide" style="margin-top: 20px;font-size: 13px" border="1"-->
    <!--cellspacing="0" cellpadding="0">-->
    <!--<tr>-->
    <!--<td width="40%" align="center"><label>日常活动 分数总计</label></td>-->
    <!--<td width="60%" align="center"><span class="span-total-score"></span></td>-->
    <!--</tr>-->
    <!--</table>-->

    <div class="table-a print-table-a" style="margin-top: 26px">
        <table id="table_guage" border="0" cellspacing="0" cellpadding="0">
        </table>
    </div>

    <div style="font-size: 16px;height: 26px;margin-top:26px;margin-bottom: 26px;border-bottom: 1px solid #d0d0d0;">
        <label class="print-font16">评定结果</label>
    </div>
    <table id="table_total_edit" class="table table-bordered" style="margin-top: 20px;font-size: 13px" border="1"
           cellspacing="0" cellpadding="0">
        <tr>
            <td width="40%" align="center"><span>日常活动 分数总计</span></td>
            <td width="60%" align="center"><span class="span-total-score"></span></td>
        </tr>
    </table>


    <div class="edit-page hide" style="margin-top: 20px">
        <div class="col-sm-8 col-sm-offset-4">
            <button class="btn btn-white col-sm-3" type="button" onclick="myReset()">重置</button>
            <button class="btn btn-primary col-sm-3 col-sm-offset-1" onclick="submitGaugeResult()" type="button">提交
            </button>
        </div>
    </div>

</form>
</body>

<script>

    var totalScore = 0;

    var spanTotalScore = $(".span-total-score");

    var tableTotalEdit = $("#table_total_edit");
    var tableTotal = $("#table_total");

    var textCompanion = $("#text_companion");
    var spanCompanion = $("#span_companion");

    var editPage = $(".edit-page");
    var viewPage = $(".view-page");

    //    var gaugeRecordId = $.getUrlParam("gauge_record_id");


    var gauge_groups = ['A 食物结构', 'B 使用餐具', 'C 使用炊具', 'D 刷牙', 'E 梳头', 'F 擦鼻子', 'G 洗手', 'H 洗脸/洗澡', 'I 穿套头衫或前开衫', 'J 系扣子', 'K 裤子', 'L 鞋/袜', 'M 如厕活动（衣服、大小便管理、擦屁股）', 'N 小便', 'O 大便'];

    var gauge_options = [
        ['进食稀烂 / 混合食物 / 挤压过的食物', '进食碾磨过 / 半流质的食物', '进食切碎的食物 / 块状 / 条状的食物', '进食各种质地的食物']
        ,
        ['用手指进食', '用汤匙取食物并拿至口', '灵活使用汤匙', '使用筷子', '熟练地使用筷子']
        ,
        ['抓住奶瓶或喷口瓶（盖杯）', '抓住杯子饮水，但杯子可能倾斜', '用双手安全地拿起杯子', '用一只手安全地拿起杯子', '从水壶或饮料纸盒向外倒水或饮料']
        ,
        ['张开嘴配合刷牙', '抓住牙刷，准备刷牙', '刷牙，但刷得不彻底', '刷得干净，彻底', '向牙刷挤牙膏，准备刷牙']
        ,
        ['固定头部，让别人替他梳头', '把梳子拿至头发', '梳头', '梳理缠结的头发']
        ,
        ['允许他人给擦鼻子', '向拿好的纸巾内擤出鼻涕', '被提醒时能用纸巾擦鼻子', '自己要求擦鼻子', '可以自己擤鼻涕和擦鼻子']
        ,
        ['伸出手允许他人帮助洗手', '双手互搓洗手', '打开、观赏水喉、用肥皂', '洗净双手', '擦干双手']
        ,
        ['试图清洗身体', '洗身体，但不包括洗脸', '用肥皂（和洗澡巾，如果用的话）', '将身体擦干', '洗脸并将脸擦干']
        ,
        ['帮助，例如将手伸进袖管', '脱T恤，上衣或毛衣，不包括系扣子', '穿T恤，上衣或毛衣，不包括解扣子', '穿 / 脱前开衫，不包括系扣子', '穿 / 脱前开衫，包括系扣子']
        ,
        ['试图协助系扣子', '拉开、合上拉链，不包括插上或取下拉链扣', '搭上搭扣，解开搭扣', '系纽扣，解开纽扣', '开、合拉链，插上和取下拉链扣']
        ,
        ['协助穿裤子，如将腿伸进裤管', '脱弹力裤腰的裤子', '穿弹力裤腰的裤子', '脱裤子，包括解裤子扣', '穿裤子，包括系裤子扣']
        ,
        ['脱袜子，松开鞋口', '穿上松开鞋口的鞋', '穿上袜子', '穿上鞋，鞋与脚匹配正确，使用搭扣鞋带', '系鞋带']
        ,
        ['协助推拉裤腰', '便后试图自己揩抹', '使用坐便器、取手纸及冲洗厕所', '便前便后整理衣服', '大便后自己擦净']
        ,
        ['尿湿后懂得表示', '需小便时有时会表示（白天）', '需小便时总能表示去厕所', '需小便时自己去厕所（白天）', '日夜均能保持干爽']
        ,
        ['需要更换时有所表示', '需大便时有时会表示（白天）', '需大便时总能表示去厕所（白天）', '能区别是大便还是小便', '没有大便意外']
    ];

    builderQuestion();

    //    initPage();
    //
    //
    //
    //    function initPage() {
    //
    //
    //
    //    }

    function builderQuestion() {
        var index = 1;

        for (var i = 0; i < gauge_groups.length; i++) {
            for (var j = 0; j < gauge_options[i].length; j++) {

                if (j == 0) {
                    //添加组标题
                    var groupTr = "";
                    if (i > 0) {
                        groupTr += "<tr><td  height='30px' class='group-margin'></td></tr>";
                    }
                    groupTr +=
                        "<tr><td align='left' ><label style='font-size: 14px' class='label-group'>" + gauge_groups[i] + "</label></td></tr>";
                    $("#table_guage").append(groupTr);
                }

                var radio = '<table width="100%"  border="0" cellspacing="0" cellpadding="0">' +
                    '<tr>' +
                    '<td align="center" width="40%"></td>' +
                    '<td  width="30%" align="left"><input type="radio" value="0" class="question-radio min" onchange="changeSelect()" name="radio_' + i + '_' + j + '"/><span class="span-radio">不能</span></td>' +
                    '<td  width="30%" align="left"><input type="radio" value="1" class="question-radio max" onchange="changeSelect()" name="radio_' + i + '_' + j + '"/><span class="span-radio">能</span></td>' +
                    '</tr></table>';

                var selectTr = "<tr>" +
                    "<td align='left' style='font-size:13px;padding-left:25px' id='td_" + i + "_" + j + "' ><span class='span-question'>" + (index++) + " ．" + gauge_options[i][j].trim() + "</span></td>" +
                    "</tr>" +
                    "<tr><td  id='td_select_" + i + "_" + j + "' class='print-td'>" +
                    "</td></tr>" + "<tr><td  height='6.5px' style='border-bottom:1px dashed #d0d0d0;' class='print-td'></td></tr><tr><td class='print-td-margin' height='6.5px'></td></tr>";
//                        "<tr><td height='15px'><hr style='height:1px;border:none;border-top:1px dashed #d0d0d0;'/></td></tr>";

                $("#table_guage").append(selectTr);
                $("#td_select_" + i + "_" + j).append(radio);
            }
        }

//        if(editable==false){
//            $(".question-radio").attr('disabled','disabled');
//        }
    }

    function changeSelect() {

        totalScore = 0;

        for (var i = 0; i < gauge_groups.length; i++) {
            for (var j = 0; j < gauge_options[i].length; j++) {
//                var value=$("#select_" + i + "_" + j).val();
                var value = $("input[name='radio_" + i + "_" + j + "']:checked").val();
                if (typeof(value) == "undefined") {
                    value = 0;
                }
                totalScore += parseInt(value);
            }
        }
        spanTotalScore.text(totalScore);

    }

    //    function submit(){
    //        changeSelect();
    //        var gauge={};
    //
    //        gauge.total_score=totalScore;
    //
    //        var questions=[];
    //
    //        var index=0;
    //
    //        for (var i = 0; i < gauge_groups.length; i++) {
    //            for (var j = 0; j < gauge_options[i].length; j++) {
    //                var questionKey=$("#td_" + i + "_" + j).html();
    //                questionKey=questionKey.split("．")[1].trim();
    //
    //                var result=$("input[name='radio_" + i + "_" + j+"']:checked").val();
    //                if(typeof(result) == "undefined"){
    //                    result=0;
    //                }
    //                var question={};
    //                question.key=questionKey;
    //                question.value=result;
    //                questions[index++]=question;
    //            }
    //        }
    //
    //        gauge.questions=questions;
    //        gauge.companion=textCompanion.val();
    //        debugAlert(gauge);
    //
    //        mandy_post_gauge_record_result(gaugeRecordId, JSON.stringify(gauge), function (data) {
    //            debugAlert(data);
    //            utils.msgSuccess("提交成功");
    //        });
    //    }

    function setEditable(edit) {

        editPage.removeClass('hide');
        if (edit == true || edit == 'true') {
//            editPage.removeClass('hide');
//            viewPage.addClass('hide');
        } else {
//            mandy_get_gauge_record(gaugeRecordId,prcpItemId,function (data) {
//                debugAlert(data.result);
//                var result=eval('('+data.result+')');
//
//                for (var i = 0; i < gauge_groups.length; i++) {
//                    for (var j = 0; j < gauge_options[i].length; j++) {
//                        var questions=result.questions;
//                        for(var k=0;k<questions.length;k++){
//                            if(questions[k].key.trim()==gauge_options[i][j].trim()){
//                                $("input[name='radio_" + i + "_" + j + "']:eq("+questions[k].value+")").attr("checked",'checked');
//                            }
//                        }
//                    }
//                }
//
//                spanTotalScore.text(result.total_score);
//                spanCompanion.text(result.companion);
//            });
            textCompanion.attr("disabled", true);
//            viewPage.removeClass('hide');
            editPage.addClass('hide');
            $(".question-radio").attr('disabled', 'disabled');
        }

    }

    function setGaugeResult(result) {
        for (var i = 0; i < gauge_groups.length; i++) {
            for (var j = 0; j < gauge_options[i].length; j++) {
                var questions = result.questions;
                for (var k = 0; k < questions.length; k++) {
                    if (questions[k].key.trim() == gauge_options[i][j].trim()) {
                        $("input[name='radio_" + i + "_" + j + "'][value=" + questions[k].value + "]").attr("checked", 'checked');
                    }
                }
            }
        }

        spanTotalScore.text(result.total_score);
//        spanCompanion.text(result.companion);
        textCompanion.val(result.companion);
    }


    function getGaugeResult() {
        changeSelect();
        var gauge = {};

        gauge.total_score = totalScore;

        var questions = [];

        var index = 0;

//        if(textCompanion.val().trim()==null||textCompanion.val().trim()==''){
//            utils.msgError("请填写陪同者!");
//            return;
//        }

        for (var i = 0; i < gauge_groups.length; i++) {
            for (var j = 0; j < gauge_options[i].length; j++) {
                var questionKey = $("#td_" + i + "_" + j).html();
                questionKey = questionKey.split("．")[1].trim().replace("</span>", "");

                var result = $("input[name='radio_" + i + "_" + j + "']:checked").val();
                if (typeof(result) == "undefined") {
//                    result=0;
                    utils.msgError("第" + (index + 1) + "个选项还未评估!");
                    $("input[name='radio_" + i + "_" + j + "']").focus();
                    return;
                }
                var question = {};
                question.key = questionKey;
                question.value = result;
                questions[index++] = question;
            }
        }

        gauge.questions = questions;
        gauge.companion = textCompanion.val();

        if (result.companion == null || result.companion == '') {
//            spanCompanion.text("无");
        } else {
            textCompanion.text(result.companion);
//            spanCompanion.text(result.companion);
        }
        debugAlert(gauge);
        return gauge;
    }

    function getCount() {
        spanTotalScore.text(null);
    }


</script>

</html>
